import * as React from 'react'
import { createRoot } from 'react-dom/client'
import { api_gitee } from "../../apis";
import { addMessageListener, MessageType } from "../../util/message";
import { dispatch } from "./store";
import ShowInfo from './components/ShowInfo'
import ZH_CN from 'antd/lib/locale-provider/zh_CN'
import { ConfigProvider, message } from 'antd';
import styles from './content.less'
import { global_init } from '../../util/inits';

global_init()

addMessageListener(function (msg) {
    switch (msg.type) {
    case MessageType.CONTENT_START:
        runApp()
        break
    case MessageType.CONTENT_STOP:
        dropApp()
        break
    }
})

const container: HTMLElement = (function () {
    const el = document.createElement('div')
    el.id = __CONFIG__.prefixClass
    el.classList.add(__CONFIG__.prefixClass, styles.container)
    document.body.appendChild(el)
    return el
})()
const root = createRoot(container)

const runApp = function () {
    api_gitee.user_info().then(res => {
        dispatch(state => ({...state, loginUser: res.data, loading: false, mode: 'default'}))
    }).finally(function () {
        root.render(<ConfigProvider locale={ZH_CN} getPopupContainer={() => container} getTargetContainer={() => container}>
            <ShowInfo />
        </ConfigProvider>)
        message.config({
            getContainer: () => container
        })
    })
}

const dropApp = function () {
    root.unmount()
}

// document.addEventListener('DOMContentLoaded', runApp)
// runApp()